<template>
  <div class="app-container">
    <!-- 条件栏 -->
    <PageFilter
      v-model:query="filterInfo.query"
      :filter-list="filterInfo.list"
    />
    <!-- 表格 -->
    <TableContainer
      :refresh="tableInfo.refresh"
      :init-curpage="tableInfo.initCurpage"
      v-model:data="tableInfo.data"
      :api="getRrgUserList"
      :check-box="false"
      :query="filterInfo.query"
      :field-list="tableInfo.fieldList"
    >
      <template v-slot:col-deptName="scope">
        <span class="slip-edit" @click="toOrgan(scope.row)">{{
          scope.row.deptName
        }}</span>
      </template>
    </TableContainer>
  </div>
</template>

<script setup name="user">
import { getRrgUserList } from '@/api/base.js'
import { getDeptAll } from '@/api/core'
// import { useRoute } from 'vue-router'
// const $router = useRoute()
const store = useStore()

const { proxy } = getCurrentInstance()
// 过滤相关配置
const filterInfo = ref({
  query: {
    statusMult: '0,1',
    sort: 'dept_id desc',
    idMult: '',
  },
  list: [
    {
      type: 'input',
      label: '名称',
      value: 'nameLike',
      event: search,
    },
    {
      type: 'slip-select',
      label: '部门',
      value: 'deptIdMult',
      api: getDeptAll,
      multiple: true,
      event: search,
    },
    {
      type: 'select-model',
      label: '状态',
      value: 'status',
      code: 'enabled_type',
      event: searchStatus,
    },
    { type: 'button', label: '搜索', event: search },
  ],
})
// 表格相关
const tableInfo = ref({
  refresh: 1,
  initCurpage: 1,
  data: [],
  fieldList: [
    { label: '工号', value: 'userName' },
    { label: '名称', value: 'name' },
    { label: '部门', value: 'deptName', type: 'slot' },
    { label: '性别', value: 'sexValue' },
    { label: '角色', value: 'roleName' },
    { label: '联系方式', value: 'tel' },
    {
      label: '唯一凭证',
      value: 'uniqueVoucher',
      hidden:
        store.state.user.userInfo.user.type === 'org_admin' ? false : true,
    },
    { label: '状态', value: 'statusValue' },
  ],
})
watch(
  () => proxy.$router,
  (route) => {
    const params = route.params
    if (params && params.fromType === 'user' && route.name === 'user') {
      filterInfo.value.query.idMult = params.userId
      getList()
    }
  },
  {
    immediate: true,
  }
)
function searchStatus() {
  if (filterInfo.value.query.status != null) {
    filterInfo.value.query.statusMult = filterInfo.value.query.status
  } else {
    filterInfo.value.query.statusMult = '0,1'
  }
  search()
}
// 获取列表
function getList() {
  tableInfo.value.refresh = Math.random()
}

// 搜索
function search() {
  // 重置分页
  filterInfo.value.query.idMult = ''
  tableInfo.value.initCurpage = Math.random()
  tableInfo.value.refresh = Math.random()
}
function toOrgan(row) {
  proxy.$router.push({
    name: 'organization',
    params: row,
  })
}
onMounted(() => {
  getList()
})
</script>

<style scoped></style>
